import api from '@/utils/api'
import { constantRoutes } from '@/router'
import Layout from '@/layout/index.vue'
import error from '@/views/404.vue'
const modules = import.meta.glob("/src/views/**/*.vue");

// const modules = import.meta.glob("/src/views/")
function getAsyncRoutes(routes) {
  const routeArr = []
  const keys = ['path', 'name', 'children', 'redirect', 'meta', 'isHidden']
  routes.forEach(item => {
    if (item.type === 'button') return
    const newItem = {
      meta: { icon: item.icon, title: item.name, activeMenu: item.activeMenu }
    }
    if (item.component) {
      if(item.component==='layout/index'){
        newItem.component = Layout
      }else{
        newItem.component = modules[`/src/${item.component}.vue`]
      }
    }

    for (const key in item) {
      if (keys.includes(key) && item.type === 'menu') {
        newItem[key] = item[key]
      }
    }
    if (newItem.children && newItem.children.length === 1 && newItem.children[0].type === 'menu') {
      // 只有一个下级菜单时 需要提升为一级菜单 父级的redirect 指向子级 子级隐藏 并且activeMenu为父级
      newItem.children[0].hidden = true
      newItem.children[0].activeMenu = newItem.path
      newItem.meta.title = newItem.children[0].name
      newItem.redirect = newItem.children[0].path
      newItem.children = getAsyncRoutes(item.children)
    } else if (newItem.children && newItem.children.length) {
      newItem.children = getAsyncRoutes(item.children)
    } else if (newItem.children.length === 0) {
      delete newItem.children
    }
    // 这里修改一下
    if (newItem.children && newItem.children.length > 0) {
      newItem.redirect = newItem.children[0].path
    }
    routeArr.push(newItem)
  })
  return routeArr
}

function setBtnList(routes) {
  const btnList = []
  recursion(routes)
  function recursion(routes) {
    routes.forEach(item => {
      if (item.children) {
        recursion(item.children)
      }
      if (item.type === 'button') {
        btnList.push(item.btnTag)
      }
    })
  }
  return btnList
}

const state = {
  routes: [],
  addRoutes: [],
  btnList: []
}

const mutations = {
  SET_ROUTES: (state, routes) => {
    state.addRoutes = routes
    state.routes = constantRoutes.concat(routes)
  },
  SET_BTNLIST: (state, btnList) => {
    state.btnList = btnList
  }
}

const actions = {
  generateRoutes(store) {
    const { commit, dispatch, rootState } = store
    return new Promise(resolve => {
      dispatch('getRouter', rootState.user.userInfo.userId).then(res => {
        const routeArr = getAsyncRoutes(res)
        routeArr.push({ path: '*', name: '404', component: error, hidden: true, meta: { title: '404' }})
        const btnList = setBtnList(res)
        commit('SET_ROUTES', routeArr)
        commit('SET_BTNLIST', btnList)
        resolve(routeArr)
      })
    })
  },
  getRouter({}, userId) {
    return new Promise(resolve => {
      api.get(`${import.meta.env.VUE_APP_SYSTEM_API}/menu/user/${userId}`, {
        menuModel: 'monitor'
      }).then(res => {
        resolve(res)
      })
    })
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
